<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/mine.css">
</head>
<body>
    <div class="warp">
        <header>
            <div class="header_top">
                <!-- 返回按钮 -->
                <button class="back_btn"><a href="#">back</a></button>
                <!-- 页面标题文字 -->
                <p class="head_name">发现</p>
                <!-- 右侧城市下拉框 -->
                <div class="letter_icon_box">
                    <i class="iconfont icon-xinfeng2 header_xinfeng"></i>
                    <div class="icon_num"><span>2</span></div>
                </div>
                </div>
                <!-- 中间登录部分 -->
            <div class="header_mid">
                <!-- 左区域 -->
                 <div class="header_mid_left">
                    <!-- 头像 -->
                    <div class="head_picture">
                        <img src="./img/mine/headpictrue.png" alt="">
                    </div>
                    <div class="person_pass">
                        <p><a href="#">点击登录</a></p>
                        <p><a href="#">常居地未设置</a></p>
                    </div>
                 </div>
                 <!-- 右箭头 -->
                 <p class="right_icon"><a href="#">&gt;</a></p>
            </div>
            <!-- 底部我的点评、收藏、优惠券 -->
            <div class="header_botm">
                 <div class="mine_navlist">
                      <div class="mine_nav_box"><img src="./img/mine/dianpin_bg.png" alt=""><p>我的点评</p></div>
                      <div class="mine_nav_box"><img src="./img/mine/shoucang_bg.png" alt=""><p>我的收藏</p></div>
                      <div class="mine_nav_box"><img src="./img/mine/youhuiquan_bg.png" alt=""><p>我的优惠券</p></div>
                 </div>
            </div>
        </header>
        <main>
            <div class="mine_cont_list">
                <!-- 我的钱包 -->
                <div class="infotitle">
                    <div class="infotitle_left"><img src="./img/mine/qianbao_logo.png" alt=""><span>热门搜索</span></div>
                    <div class="infotitle_right">
                          <a href="#">
                            <span>更多</span>
                            <!-- 右箭头 -->
                            <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                          </a>
                </div>
            </div>
            <!-- 待点评 -->
            <div class="infotitle">
                <div class="infotitle_left"><img src="./img/mine/daidianpin_logo.png" alt=""><span>热门搜索</span></div>
                <div class="infotitle_right">
                      <a href="#">
                        <span>更多</span>
                        <!-- 右箭头 -->
                        <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                      </a>
            </div>
        </div>
        <!-- 找好友 -->
        <div class="infotitle">
            <div class="infotitle_left"><img src="./img/mine/zhaohaoyou_logo.png" alt=""><span>热门搜索</span></div>
            <div class="infotitle_right">
                  <a href="#">
                    <span>更多</span>
                    <!-- 右箭头 -->
                    <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                  </a>
          </div>
        </div>
    <!-- 我的足迹 -->
        <div class="infotitle">
            <div class="infotitle_left"><img src="./img/mine/zuji_logo.png" alt=""><span>热门搜索</span></div>
            <div class="infotitle_right">
                <a href="#">
                    <span>更多</span>
                        <!-- 右箭头 -->
                        <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                </a>
            </div>
        </div>
        <!-- 设置 -->
        <div class="infotitle">
            <div class="infotitle_left"><img src="./img/mine/set_logo.png" alt=""><span>热门搜索</span></div>
            <div class="infotitle_right">
                  <a href="#">
                    <span>更多</span>
                    <!-- 右箭头 -->
                    <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                  </a>
            </div>
        </div>
        <!-- 联系 -->
        <div class="infotitle">
            <div class="infotitle_left"><img src="./img/mine/phone_logo.png" alt=""><span>热门搜索</span></div>
            <div class="infotitle_right">
                  <a href="#">
                    <span>更多</span>
                    <!-- 右箭头 -->
                    <i class="iconfont icon-youjiantou_huaban right_icon"></i>
                  </a>
            </div>
        </div>
            </div>
            <div class="mine_botm_box">
                <button class="quite_btn"><a href="#">退出</a></button>
                <button class="cancellation_btn"><a href="#">注销</a></button>
            </div>
        </main>
        <!-- 底部导航栏 -->
        <footer>
            <div class="navb_list">
                <div class="nav_box">
                    <p><a href="./index.html"><i class="iconfont icon-shouye3 shouye_icon"></i></a></p>
                    <p>首页</p>
                </div>
                <div class="nav_box">
                    <p><a href="./classification.html"><i class="iconfont icon-fenlei classification_icon"></i></a></p>
                    <p>分类</p>
                </div>
                <div class="nav_box">
                    <p><a href="./find.html"><i class="iconfont icon-21 find_icon"></i></a></p>
                    <p>发现</p>
                </div>
                <div class="nav_box">
                    <p><a href="./mine.html"><i class="iconfont icon-wode mine_icon"></i></a></p>
                    <p>我的</p>
                </div>
           </div>
            </footer>
    </div>
</body>
</html>